import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../../providers/auth_provider.dart';
import '../../providers/todo_provider.dart';
import '../../widgets/platform/adaptive_card.dart';
import '../../../core/platform/platform_detector.dart';
// 导入窗口管理器
import '../../../core/platform/window_manager.dart';

/// 主页页面 - 需求管理平台首页
class HomePage extends ConsumerStatefulWidget {
  const HomePage({super.key});

  @override
  ConsumerState<HomePage> createState() => _HomePageState();
}

class _HomePageState extends ConsumerState<HomePage> {
  @override
  void initState() {
    super.initState();
    // 在页面初始化时加载待办任务数据
    WidgetsBinding.instance.addPostFrameCallback((_) {
      ref.read(todoStateProvider.notifier).loadTodos();
    });

    // 设置窗口为可调整大小
    _setResizableWindow();
  }

  // 设置窗口为可调整大小
  void _setResizableWindow() {
    WindowManager.setWindowStyle(false); // 可调整大小
    // 设置窗口为笔记本大小
    WindowManager.setWindowSize(1200, 800); // 设置窗口大小为更大的笔记本大小
  }

  @override
  Widget build(BuildContext context) {
    final currentUser = ref.watch(currentUserProvider);

    // 添加调试信息
    print('构建主页页面，当前用户: $currentUser');

    return Scaffold(
      body: LayoutBuilder(
        builder: (context, constraints) {
          // 添加调试信息
          print('Layout constraints: ${constraints.biggest}');
          // 根据平台调整布局
          if (PlatformDetector.isDesktop() || PlatformDetector.isWeb()) {
            return _buildDesktopLayout(context, currentUser);
          } else {
            return _buildMobileLayout(context, currentUser);
          }
        },
      ),
      // 新增需求浮动按钮
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          // 创建新需求的逻辑
          if (context.mounted) {
            ScaffoldMessenger.of(context).showSnackBar(
              const SnackBar(content: Text('创建新需求功能待实现')),
            );
          }
        },
        child: const Icon(Icons.add),
      ),
    );
  }

  // 构建搜索框
  Widget _buildSearchBar() {
    return SizedBox(
      width: 250,
      child: Container(
        constraints: const BoxConstraints(maxWidth: 250),
        padding: const EdgeInsets.symmetric(horizontal: 12),
        decoration: BoxDecoration(
          color: Colors.grey[100],
          borderRadius: BorderRadius.circular(8),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            const Icon(Icons.search, size: 18, color: Colors.grey),
            const SizedBox(width: 8),
            Expanded(
              child: TextField(
                decoration: const InputDecoration(
                  hintText: '搜索需求、文档、数据源...',
                  border: InputBorder.none,
                  contentPadding: EdgeInsets.zero,
                  isDense: true,
                ),
                style: const TextStyle(fontSize: 14),
              ),
            ),
          ],
        ),
      ),
    );
  }

  // 构建通知按钮
  Widget _buildNotificationButton() {
    return SizedBox(
      width: 48,
      height: 48,
      child: Stack(
        children: [
          IconButton(
            icon: const Icon(Icons.notifications_none),
            onPressed: () {
              // 通知页面导航
            },
            iconSize: 24, // 设置图标大小
          ),
          Positioned(
            right: 8,
            top: 8,
            child: Container(
              width: 16,
              height: 16,
              decoration: const BoxDecoration(
                color: Colors.red,
                shape: BoxShape.circle,
              ),
              child: const Center(
                child: Text(
                  '3',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 10,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  // 构建用户头像
  Widget _buildUserAvatar(dynamic currentUser) {
    return PopupMenuButton<String>(
      onSelected: (value) {
        switch (value) {
          case 'settings':
            // 个人设置
            break;
          case 'logout':
            // 退出登录
            break;
        }
      },
      itemBuilder: (context) => <PopupMenuEntry<String>>[
        const PopupMenuItem<String>(
          value: 'settings',
          child: Text('个人设置'),
        ),
        const PopupMenuItem<String>(
          value: 'logout',
          child: Text('退出登录'),
        ),
      ],
      child: SizedBox(
        width: 120, // 添加固定宽度以避免无限宽度问题
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            CircleAvatar(
              radius: 16,
              backgroundColor: Theme.of(context).primaryColor,
              child: Text(
                currentUser?.username.substring(0, 1).toUpperCase() ?? 'U',
                style: const TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            const SizedBox(width: 8),
            Flexible(
              // 使用Flexible防止用户名过长导致溢出
              child: Text(
                currentUser?.username ?? '用户',
                style: const TextStyle(
                  overflow: TextOverflow.fade,
                ),
                overflow: TextOverflow.fade, // 添加溢出处理
              ),
            ),
            const Icon(Icons.arrow_drop_down, size: 16),
          ],
        ),
      ),
    );
  }

  // 构建AI助手按钮
  Widget _buildAIPromptButton() {
    return SizedBox(
      height: 36,
      child: ElevatedButton.icon(
        onPressed: () {
          // AI助手功能
        },
        icon: const Icon(Icons.android, size: 16),
        label: const Text('AI 助手'),
        style: ElevatedButton.styleFrom(
          padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
          textStyle: const TextStyle(fontSize: 12),
          tapTargetSize: MaterialTapTargetSize.shrinkWrap,
          minimumSize: const Size(100, 36),
          fixedSize: const Size.fromHeight(36), // 添加fixedSize以确保高度一致
        ),
      ),
    );
  }

  Widget _buildMobileLayout(BuildContext context, dynamic currentUser) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min, // 添加mainAxisSize以避免无限高度
        children: [
          // 今日概览卡片
          _buildTodayOverview(),
          const SizedBox(height: 32),

          // 快捷操作
          _buildQuickActions(context),
          const SizedBox(height: 32),

          // 流程可视化
          _buildProcessVisualization(),
          const SizedBox(height: 32),

          // 团队协作动态
          _buildTeamCollaboration(),
          const SizedBox(height: 32),

          // AI推荐优先级任务
          _buildAIRecommendations(),
        ],
      ),
    );
  }

  Widget _buildDesktopLayout(BuildContext context, dynamic currentUser) {
    return SingleChildScrollView(
      padding: const EdgeInsets.all(24.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min, // 添加mainAxisSize以避免无限高度
        children: [
          // 今日概览卡片
          _buildTodayOverview(),
          const SizedBox(height: 40), // 增加间距以提供更多空间

          // 快捷操作
          _buildQuickActions(context),
          const SizedBox(height: 40), // 增加间距以提供更多空间

          // 流程可视化
          _buildProcessVisualization(),
          const SizedBox(height: 40), // 增加间距以提供更多空间

          // 团队协作动态
          _buildTeamCollaboration(),
          const SizedBox(height: 40), // 增加间距以提供更多空间

          // AI推荐优先级任务
          _buildAIRecommendations(),
        ],
      ),
    );
  }

  // 构建今日概览卡片
  Widget _buildTodayOverview() {
    final stats = [
      {'title': '待处理任务数', 'value': '5', 'color': Colors.blue, 'icon': Icons.assignment},
      {'title': '新增需求数', 'value': '2', 'color': Colors.green, 'icon': Icons.add_task},
      {'title': '异常待办数', 'value': '1', 'color': Colors.red, 'icon': Icons.warning},
      {'title': 'UAT 待确认问题数', 'value': '3', 'color': Colors.orange, 'icon': Icons.feedback},
    ];

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          '今日概览',
          style: Theme.of(context).textTheme.titleLarge,
        ),
        const SizedBox(height: 16),
        LayoutBuilder(
          builder: (context, constraints) {
            // 根据可用宽度动态调整列数和高度
            int crossAxisCount = 4;
            double height = 180;
            double aspectRatio = 1.6;

            if (constraints.maxWidth < 600) {
              crossAxisCount = 2;
              height = 200; // 在更少列数时增加高度
              aspectRatio = 1.8;
            } else if (constraints.maxWidth < 900) {
              crossAxisCount = 3;
              height = 190;
              aspectRatio = 1.7;
            }

            return SizedBox(
              height: height,
              child: GridView.builder(
                shrinkWrap: true,
                physics: const NeverScrollableScrollPhysics(),
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: crossAxisCount,
                  crossAxisSpacing: 16,
                  mainAxisSpacing: 16,
                  childAspectRatio: aspectRatio, // 调整宽高比以提供更多垂直空间
                ),
                itemCount: stats.length,
                itemBuilder: (context, index) {
                  final stat = stats[index];
                  return _buildStatCard(
                    stat['title'] as String,
                    stat['value'] as String,
                    stat['color'] as Color,
                    stat['icon'] as IconData,
                  );
                },
              ),
            );
          },
        ),
      ],
    );
  }

  // 构建统计数据卡片
  Widget _buildStatCard(String title, String value, Color color, IconData icon) {
    return AdaptiveCard(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(icon, size: 32, color: color), // 添加图标
          const SizedBox(height: 8),
          Text(
            value,
            style: TextStyle(
              fontSize: 24,
              fontWeight: FontWeight.bold,
              color: color,
            ),
          ),
          const SizedBox(height: 8),
          Flexible(
            child: Text(
              title,
              style: const TextStyle(
                fontSize: 14,
                color: Colors.grey,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
          const SizedBox(height: 8), // 添加一些底部间距
        ],
      ),
    );
  }

  // 构建快捷操作区域
  Widget _buildQuickActions(BuildContext context) {
    final actions = [
      {
        'title': '需求 A',
        'progress': 60.0,
        'assignee': '李四',
        'dueDate': '2023-10-15'
      },
      {
        'title': '需求 B',
        'progress': 30.0,
        'assignee': '王五',
        'dueDate': '2023-10-20'
      },
      {
        'title': '需求 C',
        'progress': 90.0,
        'assignee': '赵六',
        'dueDate': '2023-10-10'
      },
      {
        'title': '需求 D',
        'progress': 10.0,
        'assignee': '孙七',
        'dueDate': '2023-10-25'
      },
      {
        'title': '需求 E',
        'progress': 75.0,
        'assignee': '周八',
        'dueDate': '2023-10-12'
      },
    ];

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(
              '快捷操作',
              style: Theme.of(context).textTheme.titleLarge,
            ),
            SizedBox(
              height: 36, // 设置固定高度
              width: 120, // 添加固定宽度以避免无限宽度问题
              child: ElevatedButton(
                onPressed: () {
                  // 创建新需求
                },
                child: const Text('创建新需求'),
              ),
            ),
          ],
        ),
        const SizedBox(height: 16),
        LayoutBuilder(
          builder: (context, constraints) {
            // 根据可用宽度动态调整列数和高度
            int crossAxisCount = 2;
            double height = 300;
            double aspectRatio = 0.9;

            if (constraints.maxWidth > 600) {
              crossAxisCount = 3;
              height = 320;
              aspectRatio = 1.0;
            }
            if (constraints.maxWidth > 900) {
              crossAxisCount = 4;
              height = 340;
              aspectRatio = 1.1;
            }
            if (constraints.maxWidth > 1200) {
              crossAxisCount = 5;
              height = 360;
              aspectRatio = 1.2;
            }

            return SizedBox(
              height: height,
              child: GridView.builder(
                shrinkWrap: true,
                physics: const NeverScrollableScrollPhysics(),
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: crossAxisCount,
                  crossAxisSpacing: 16,
                  mainAxisSpacing: 16,
                  childAspectRatio: aspectRatio, // 调整宽高比以提供更多垂直空间
                ),
                itemCount: actions.length,
                itemBuilder: (context, index) {
                  final action = actions[index];
                  return _buildQuickActionCard(action);
                },
              ),
            );
          },
        ),
      ],
    );
  }

  // 构建快捷操作卡片
  Widget _buildQuickActionCard(Map<String, dynamic> action) {
    return AdaptiveCard(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min,
        children: [
          Flexible(
            // 使用Flexible防止标题过长导致溢出
            child: Text(
              action['title'] as String,
              style: const TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 14,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
          const SizedBox(height: 8),
          // 进度条
          ClipRRect(
            borderRadius: BorderRadius.circular(4),
            child: LinearProgressIndicator(
              value: (action['progress'] as double) / 100,
              backgroundColor: Colors.grey[200],
              valueColor: AlwaysStoppedAnimation<Color>(
                _getProgressColor(action['progress'] as double),
              ),
            ),
          ),
          const SizedBox(height: 8),
          Flexible(
            child: Text(
              '负责人：${action['assignee']}',
              style: const TextStyle(
                fontSize: 12,
                color: Colors.grey,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
          const SizedBox(height: 4), // 添加一些间距
          Flexible(
            child: Text(
              '截止：${action['dueDate']}',
              style: const TextStyle(
                fontSize: 12,
                color: Colors.grey,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
        ],
      ),
    );
  }

  // 根据进度获取颜色
  Color _getProgressColor(double progress) {
    if (progress < 30) return Colors.red;
    if (progress < 70) return Colors.orange;
    return Colors.green;
  }

  // 构建流程可视化区域
  Widget _buildProcessVisualization() {
    final steps = [
      {'title': '需求沟通', 'completed': true, 'active': false},
      {'title': '任务排期', 'completed': true, 'active': false},
      {'title': '文档编写', 'completed': false, 'active': true},
      {'title': '数据源核查', 'completed': false, 'active': false},
      {'title': '模型设计', 'completed': false, 'active': false},
      {'title': '开发', 'completed': false, 'active': false},
      {'title': '测试', 'completed': false, 'active': false},
      {'title': 'UAT / 发布', 'completed': false, 'active': false},
    ];

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Flexible(
              // 使用Flexible防止标题溢出
              child: Text(
                '流程可视化',
                style: Theme.of(context).textTheme.titleLarge,
              ),
            ),
            TextButton(
              onPressed: () {
                // 展开流程图
              },
              child: const Text('展开流程图'),
            ),
          ],
        ),
        const SizedBox(height: 16),
        AdaptiveCard(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              // 步骤展示
              SizedBox(
                height: 160, // 增加高度以提供更多空间
                width: double.infinity,
                child: SingleChildScrollView(
                  scrollDirection: Axis.horizontal,
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: List.generate(steps.length, (index) {
                      final step = steps[index];
                      return _buildProcessStep(
                          step, index, index == steps.length - 1);
                    }).toList(),
                  ),
                ),
              ),
              const SizedBox(height: 16),
              // 卡点信息
              Container(
                padding: const EdgeInsets.all(12),
                decoration: BoxDecoration(
                  color: Colors.red[50],
                  borderRadius: BorderRadius.circular(8),
                ),
                child: Row(
                  children: [
                    const Icon(Icons.warning, color: Colors.red, size: 16),
                    const SizedBox(width: 8),
                    Expanded(
                      child: Text(
                        '当前卡点：文档编写',
                        style: const TextStyle(
                          color: Colors.red,
                          fontSize: 14,
                        ),
                        overflow: TextOverflow.ellipsis, // 添加溢出处理
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }

  // 构建流程步骤
  Widget _buildProcessStep(Map<String, dynamic> step, int index, bool isLast) {
    final bool completed = step['completed'] as bool;
    final bool active = step['active'] as bool;

    Color getStepColor() {
      if (completed) return Theme.of(context).primaryColor;
      if (active) return Colors.orange;
      return Colors.grey;
    }

    return SizedBox(
      width: 110,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            width: 40,
            height: 40,
            decoration: BoxDecoration(
              color: getStepColor(),
              shape: BoxShape.circle,
            ),
            child: Center(
              child: Text(
                '${index + 1}',
                style: const TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ),
          const SizedBox(height: 4),
          Flexible(
            // 使用Flexible防止文本溢出
            child: Text(
              step['title'] as String,
              style: TextStyle(
                fontSize: 10,
                color: getStepColor(),
              ),
              textAlign: TextAlign.center,
              overflow: TextOverflow.ellipsis,
              maxLines: 2,
            ),
          ),
          if (!isLast)
            SizedBox(
              height: 16,
              child: Transform.rotate(
                angle: 0,
                child: Icon(
                  Icons.arrow_right_alt,
                  size: 12,
                  color:
                      completed ? Theme.of(context).primaryColor : Colors.grey,
                ),
              ),
            )
          else
            const SizedBox(height: 8), // 减少底部间距以避免溢出
        ],
      ),
    );
  }

  // 构建团队协作动态
  Widget _buildTeamCollaboration() {
    final activities = [
      {'user': '李四', 'action': '提交了《需求 A》的模型设计文档', 'time': '2023-10-10 14:30'},
      {'user': '王五', 'action': '完成了‘数据源核查’任务', 'time': '2023-10-10 13:45'},
      {'user': '赵六', 'action': '在《需求 B》中添加了备注', 'time': '2023-10-10 12:15'},
    ];

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          '团队协作动态',
          style: Theme.of(context).textTheme.titleLarge,
        ),
        const SizedBox(height: 16),
        AdaptiveCard(
          child: Column(
            // 使用Column替代ListView.builder以避免无限高度问题
            mainAxisSize: MainAxisSize.min,
            children: [
              for (int i = 0; i < activities.length; i++)
                _buildActivityItem(activities[i], i != activities.length - 1),
            ],
          ),
        ),
      ],
    );
  }

  // 构建活动项
  Widget _buildActivityItem(Map<String, dynamic> activity, bool showDivider) {
    return Column(
      children: [
        ListTile(
          leading: CircleAvatar(
            radius: 16,
            backgroundColor: Colors.grey[200],
            child: Text(
              (activity['user'] as String).substring(0, 1),
              style: const TextStyle(
                color: Colors.grey,
                fontSize: 12,
              ),
            ),
          ),
          title: Text.rich(
            TextSpan(
              children: [
                TextSpan(
                  text: activity['user'],
                  style: const TextStyle(fontWeight: FontWeight.bold),
                ),
                TextSpan(
                  text: ' ${activity['action']}',
                  style: const TextStyle(fontWeight: FontWeight.normal),
                ),
              ],
            ),
            style: const TextStyle(fontSize: 14),
            overflow: TextOverflow.ellipsis, // 添加溢出处理
            maxLines: 2, // 限制为两行
          ),
          subtitle: Text(
            activity['time'] as String,
            style: const TextStyle(
              fontSize: 12,
              color: Colors.grey,
            ),
            overflow: TextOverflow.ellipsis, // 添加溢出处理
          ),
        ),
        if (showDivider) const Divider(height: 1),
        const SizedBox(height: 8), // 添加底部间距
      ],
    );
  }

  // 构建AI推荐优先级任务
  Widget _buildAIRecommendations() {
    final recommendations = [
      {
        'title': '任务 1',
        'requirement': '需求 A',
        'priority': '紧急',
        'time': '2 小时',
        'color': Colors.red
      },
      {
        'title': '任务 2',
        'requirement': '需求 C',
        'priority': '重要',
        'time': '1.5 小时',
        'color': Colors.orange
      },
      {
        'title': '任务 3',
        'requirement': '需求 B',
        'priority': '一般',
        'time': '3 小时',
        'color': Colors.green
      },
    ];

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'AI 推荐优先级任务',
          style: Theme.of(context).textTheme.titleLarge,
        ),
        const SizedBox(height: 16),
        LayoutBuilder(
          builder: (context, constraints) {
            // 根据可用宽度动态调整列数和高度
            int crossAxisCount = 1;
            double height = 250;
            double childAspectRatio = 3.0;

            if (constraints.maxWidth > 600) {
              crossAxisCount = 2;
              height = 270;
              childAspectRatio = 1.8;
            }
            if (constraints.maxWidth > 900) {
              crossAxisCount = 3;
              height = 290;
              childAspectRatio = 1.3;
            }

            return SizedBox(
              height: height,
              child: GridView.builder(
                shrinkWrap: true,
                physics: const NeverScrollableScrollPhysics(),
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: crossAxisCount,
                  crossAxisSpacing: 16,
                  mainAxisSpacing: 16,
                  childAspectRatio: childAspectRatio, // 调整宽高比以提供更多垂直空间
                ),
                itemCount: recommendations.length,
                itemBuilder: (context, index) {
                  final recommendation = recommendations[index];
                  return _buildRecommendationCard(recommendation);
                },
              ),
            );
          },
        ),
      ],
    );
  }

  // 构建推荐卡片
  Widget _buildRecommendationCard(Map<String, dynamic> recommendation) {
    return AdaptiveCard(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisSize: MainAxisSize.min, // 添加mainAxisSize以避免无限高度
        children: [
          Flexible(
            // 使用Flexible防止标题过长导致溢出
            child: Text(
              recommendation['title'] as String,
              style: const TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 16,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
          const SizedBox(height: 8),
          Flexible(
            // 使用Flexible防止需求名称过长导致溢出
            child: Text(
              '所属需求：${recommendation['requirement']}',
              style: const TextStyle(
                fontSize: 14,
                color: Colors.grey,
              ),
              overflow: TextOverflow.ellipsis, // 添加溢出处理
              maxLines: 1, // 限制为单行
            ),
          ),
          const SizedBox(height: 8),
          Row(
            children: [
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                decoration: BoxDecoration(
                  color:
                      (recommendation['color'] as Color).withValues(alpha: 0.1),
                  borderRadius: BorderRadius.circular(4),
                ),
                child: Text(
                  recommendation['priority'] as String,
                  style: TextStyle(
                    color: recommendation['color'] as Color,
                    fontSize: 12,
                  ),
                ),
              ),
              const SizedBox(width: 8),
              Flexible(
                child: Text(
                  '预计耗时：${recommendation['time']}',
                  style: const TextStyle(
                    fontSize: 12,
                    color: Colors.grey,
                  ),
                  overflow: TextOverflow.ellipsis, // 添加溢出处理
                ),
              ),
            ],
          ),
          const SizedBox(height: 12), // 增加底部间距
          Align(
            alignment: Alignment.bottomRight,
            child: SizedBox(
              // 添加SizedBox包装器
              height: 36, // 设置固定高度
              child: TextButton(
                onPressed: () {
                  // 查看详情
                },
                child: const Text('查看详情'),
              ),
            ),
          ),
        ],
      ),
    );
  }
}